<!DOCTYPE html>
<html lang="en">

<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta charset="utf-8">
  <title></title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
  <meta name="description" content="">
  <meta name="author" content="">
  <!-- STYLESHEETS -->
  <!--[if lt IE 9]><script src="../../js/flot/excanvas.min.js"></script><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
  <link rel="stylesheet" type="text/css" href="../../css/cloud-admin.css">
  <link rel="stylesheet" type="text/css" href="../../css/themes/default.css" id="skin-switcher">
  <link rel="stylesheet" type="text/css" href="../../css/responsive.css">
  <link href="../../font-awesome/css/font-awesome.min.css" rel="stylesheet">
  <link rel="stylesheet" href="../../js/dropdown/dropdown.css">

  <!-- datatable -->
  <link rel="stylesheet" href="../../js/datatables/datatable.css">
  <link rel="stylesheet" href="../../js/datepicker/datepicker.css">


</head>

<body>
  <header class="navbar clearfix" id="header">
  </header>
  <!-- PAGE -->
  <section id="page">
    <!-- SIDEBAR -->
    <div id="sidebar" class="sidebar">
      <div class="sidebar-menu nav-collapse">
        <!-- SIDEBAR MENU -->
        <ul>
        </ul>
        <!-- /SIDEBAR MENU -->
      </div>
    </div>
    <!-- /SIDEBAR -->
    <div id="main-content">
      <div class="modal fade" id="box-config" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <form id="form_account">
          <div class="modal-dialog">
            <div class="modal-content">
              <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">结算</h4>
              </div>
              <div class="modal-body">
                <input type="text" name="id" hidden>
                <input type="text" name="reconciliationStatus" hidden>
                <div class="form-group">
                  <label class="control-label col-md-3" style="line-height:34px;">
                    <span class="required">*</span>结算金额：</label>
                  <div class="col-md-4">
                    <input type="text" class="form-control" name="price" placeholder="请输入结算金额" onkeypress="return $.IsDecimal(event);" onblur="return $.IsMoney(this);"
                      maxlength="11" />
                    <span class="error-span"></span>
                  </div>
                </div>
                <div class="form-group">
                  <label class="control-label col-md-3" style="line-height:34px;">
                    <span class="required"></span>备注：</label>
                  <div class="col-md-4">
                    <textarea name="remark" placeholder="请输入结算备注" class="form-control" style="width:280px;resize:none;"></textarea>
                    <span class="error-span"></span>
                  </div>
                </div>
              </div>

              <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-success bt-save">确定</button>
              </div>
            </div>
          </div>
        </form>
      </div>
      <div class="container">
        <div class="row">
          <div id="content" class="col-lg-12">
            <!-- PAGE HEADER-->
            <div class="row" style="height: 30px;">
              <div class="col-sm-12">
                <div class="page-header">
                  <!-- STYLER -->

                  <!-- /STYLER -->
                  <!-- BREADCRUMBS -->
                  <ul class="breadcrumb">
                    <li>
                      <i class="fa fa-home"></i>
                      <a href="../index.html">首页</a>
                    </li>
                    <li>
                      <a href="#">合同管理</a>
                    </li>
                    <li>供应商管理</li>
                  </ul>
                  <!-- /BREADCRUMBS -->

                </div>
              </div>
            </div>
            <!-- /PAGE HEADER -->
            <!-- FORMS QUERY-->
       
            <!-- /FORMS QUERY -->
            <div class="row">
              <!-- TABLES -->
              <div class="col-md-12">
                <!-- BOX -->
                <div class="box border primary">
                  <div class="box-title">
                    <h4>
                      <i class="fa fa-table"></i>结算单数：
                      <span id="total"></span>条 </h4>

                  </div>
                  <div class="box-body">
                    <table id="db_group_list" cellpadding="0" cellspacing="0" border="0" class="datatable table table-striped table-bordered table-hover">

                    </table>
                  </div>
                </div>
                <!-- /BOX -->
              </div>
            </div>
            <!-- /TABLES -->

            <div class="footer-tools">
              <span class="go-top">
                <i class="fa fa-chevron-up"></i> Top
              </span>
            </div>
          </div>
          <!-- /CONTENT-->
        </div>
      </div>
    </div>
    <form id='export_stock' action="../../admin/supplierschedule/exportSupplierReconciliation.do" class="form-horizontal" style="display: none">
      <input type="text" class="form-control" name="reconciliationId" placeholder="这里库存指花色库存">
    </form>
  <form id="export" style="display: none" action="../../admin/supplierschedule/exportData.do" method="post">
							<input type="hidden" name="startDate">
							<input type="hidden" name="endDate">	
									<input type="hidden" name="supplierId">					
	</form>
    <input type="hidden" name="groupId" />
  </section>

  <!--/PAGE -->
  <!-- JAVASCRIPTS -->
  <!-- Placed at the end of the document so the pages load faster -->
  <!-- JQUERY -->
  <script src="../../js/jquery/jquery-2.0.3.min.js"></script>
  <!-- JQUERY UI-->
  <script src="../../js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
  <!-- BOOTSTRAP -->
  <script src="../../bootstrap-dist/js/bootstrap.min.js"></script>

  <!-- BLOCK UI -->
  <script type="text/javascript" src="../../js/jQuery-BlockUI/jquery.blockUI.min.js"></script>

  <!-- AUTOSIZE -->
  <script type="text/javascript" src="../../js/autosize/jquery.autosize.min.js"></script>

  <!-- INPUT MASK -->
  <script type="text/javascript" src="../../js/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>

  <!-- SELECT2 -->
  <script type="text/javascript" src="../../js/select2/select2.min.js"></script>
  <!-- UNIFORM -->
  <script type="text/javascript" src="../../js/uniform/jquery.uniform.min.js"></script>

  <script type="text/javascript" src="../../js/datepicker/datepicker.js"></script>
  <!-- spinner -->
  <script src="../../js/spinner/spin.js"></script>
  <!-- DATA TABLES -->
  <script type="text/javascript" src="../../js/datatables/bootstrap-select.js"></script>
  <script type="text/javascript" src="../../js/datatables/datatable.js"></script>
  <script type="text/javascript" src="../../js/datatables/datatable-bootstrap.js"></script>
  <script type="text/javascript" src="../../js/datatables/datatable-tabletools.js"></script>
  <script type="text/javascript" src="../../js/datatables/fnAddTr.js"></script>

  <!--bootbox-->
  <script type="text/javascript" src="../../js/bootbox/bootbox.min.js"></script>
  <!-- COOKIE -->
  <script src="../../js/jquery-validate/jquery.validate.min.js"></script>
  <script type="text/javascript" src="../../js/jQuery-Cookie/jquery.cookie.min.js"></script>
  <!-- CUSTOM SCRIPT -->
  <script src="../../js/script.js"></script>
  <script src="../../js/common.js"></script>
  <script>
    var calibrationList = {
      id: $.getUrlParam("sid"),
      supplierName: $.getUrlParam("name"),
      $mainDataTable: null,
      init: function () {
        $(".supplierName").html(this.supplierName);
        this.searchGroup();
        this.addExprotEvent();
        this.wizform = $('#form_account');
        var that = this;
        this.wizform.validate({
          doNotHideMessage: true,
          errorClass: 'error-span',
          errorElement: 'span',
          rules: {
            price: {
              required: true
            }
          },
          highlight: function (element) {
            $(element)
              .closest('.form-group').removeClass('has-success').addClass('has-error');
          },

          unhighlight: function (element) {
            $(element)
              .closest('.form-group').removeClass('has-error');
          },
          success: function (label) {
            label.addClass('valid')
              .closest('.form-group').removeClass('has-error').addClass('has-success');
          }
        });
      },
      searchGroup: function () {
        var url = App.getContextPath() + "admin/supplierschedule/searchSupplierReconciliation.do?supplierId=" + this.id;
        var dtSetting = $.dataTableSetting({
          "ajaxSource": url,
          "serverSide": true,
          "bFilter": false,// 去掉搜索框
          "bLengthChange": false,// 每页显示数量	
          "sScrollX": "100%",
          "sScrollXInner": "100%",
          "iDisplayLength": 10,

          "bSort": false,
          "aoColumns": [{
            "mDataProp": "reconciliationCode",
            "sTitle": "结算单号",
            "width": "8%"
          }, {
            "mDataProp": "salePrice",
            "sTitle": "应结金额",
            "width": "8%",
            "class": "format_thousands"
          }, {
            "mDataProp": "saleAmount",
            "sTitle": "销售件数",
            "width": "8%"
          }, {
            "mDataProp": "returnPrice",
            "sTitle": "退货金额",
            "width": "8%",
            "class": "format_thousands"
          }, {
            "mDataProp": "returnAmount",
            "sTitle": "退货件数",
            "width": "8%"
          }, {
            "mDataProp": "reconciliationPrice",
            "sTitle": "结算金额",
            "width": "8%",
            "class": "format_thousands"
          }, {
            "mDataProp": "reconciliationStatus",
            "sTitle": "状态",
            "width": "8%",
            "render": function (data, type, row) {
              return row.reconciliationStatus == 'Buying' ? '待结算' : '已结算';
            }
          }, {
            "mDataProp": "id",
            "sTitle": "结算区间",
            "width": "15%",
            "render": function (data, type, row) {
              var endDate = row.endDate == null ? "" : $.getLocalDate(row.endDate);
              return $.getLocalDate(row.startDate) + ' - ' + endDate
            }
          }, {
            "mDataProp": "id",
            "sTitle": "结算日期",
            "width": "8%",
            "render": function (data, type, row) {
              return endDate = row.endDate == null ? "" : $.getLocalDate(row.endDate);
            }
          }, {
            "sTitle": "操作",
            "width": "21%",
            "render": function (data, type, row) {
            
              var str = "<p class='btn-toolbar' style='margin:0px'>" +
                "<a class='btn btn-success btn-xs bt-export btn-width' style='width:80px' href='javascript:;' data-id=" + row.id + ">" +
                "<i class='fa fa-arrow-circle-o-up'></i>导出账单</a>" +  
                "<a class='btn btn-success btn-xs bt-exportdetail btn-width' style='width:80px' href='javascript:;' data-id=" + calibrationList.id + " startDate="+$.getLocalDate(row.startDate)+" endDate="+$.getLocalDate(row.endDate)+">" +
                "<i class='fa fa-arrow-circle-o-up'></i>导出明细</a>" +               
                "</p>";
              return str;
            }
          }]
        });
        this.$mainDataTable = $("#db_group_list").dataTable(dtSetting);
      },
      addExprotEvent: function () {
        var that = this;
        $("#db_group_list").on("click", ".bt-export", function () {
          var $this = $(this),
            id = $this.attr('data-id');
          $("#export_stock input").val(id);
          $("#export_stock").submit();
        });
        $("#db_group_list").on("click",".bt-exportdetail",function(){	
            var $this = $(this),
            id = $this.attr('data-id');
            $("#export").find("[name=supplierId]").val(id);
			$("#export").find("[name=startDate]").val($(this).attr("startDate"));
			$("#export").find("[name=endDate]").val($(this).attr("endDate"));
			$("#export").submit();
		});
        
        $("#db_group_list").on("click", ".bt-settlement", function () {
          $("#box-config [name=price]").val($(this).attr('data-reconciliationPrice'));
          $("#box-config [name=reconciliationStatus]").val($(this).attr('data-reconciliationStatus'));
          $("#box-config [name=id]").val($(this).attr('data-id'));
          $("#box-config").modal("show");
        });
        $("#box-config").find(".bt-save").click(that.save);
      },
      save: function () {
        if (calibrationList.wizform.valid() == false) {
          return false;
        }
        var account={};
        account.remark=$("#box-config [name=remark]").val();
        account.price=$("#box-config [name=price]").val();
        account.reconciliationStatus = $("#box-config [name=reconciliationStatus]").val();
        account.id = $("#box-config [name=id]").val();
        if(account.price<=0){
          $.alert("结算金额不正确!");
          return false;
        }
        $.blockUI();
        $.ajax({
						type: "post",
						url: App.getContextPath() + "admin/store/updateSupplierReconciliation.do",
						data: {
              id: account.id,
              remark: account.remark,
              reconciliationStatus: account.reconciliationStatus,
              reconciliationPrice: account.price
            },
						async: false,
						success: function(result) {
							$.unblockUI();
              $("#box-config").modal('hide');
              setTimeout(function() {
                calibrationList.searchGroup(calibrationList.id);
              }, 250)
						},
            error: function () {
              $.unblockUI();
            }
					});
      },
    }
    $(function () {
      $("#header").load("../head.html");
      App.init();
      calibrationList.init();
    });
  </script>
  <!-- /JAVASCRIPTS -->
</body>

</html>